[VANILA JSNINJAの作成]MEAL FINDER(1)api(21/05/13)


エラー

VM228:1 Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
  fetch(`www.themealdb.com/api/json/v1/1/random.php`, {
    headers: { Accept: "application/json" },
  })
    .then((res) => res.json())
    .then((result) => console.log(result));
非同期リクエストではエラーが発生します...

データがまったくありません.これは応答が得られない場合です.非同期リクエストが失敗した理由を理解する

エラー解決

  fetch(`https://www.themealdb.com/api/json/v1/1/random.php`, {
    headers: { Accept: "application/json" },
  })
    .then((res) => res.json())
    .then((result) => console.log(result));
  • httpsが前面に貼り付けられ、正常に動作します.
  • javascript define params


    以下のようにすればよい.
    /**
     * Queries a Baz for items.
     * @param {number} groupNum Subgroup id to query.
     * @param {string|number|null} term An itemName,
     *     or itemId, or null to search everything.
     */

    Api.js

    const fetcher = async (KEY, keyword = null) => {
      const url = `https://${API_KEY}${KEY}${keyword}`;
    
    
      const res = await fetch(url);
      if (!res.ok) {
        throw new Error("삐용삐용 에러발생");
      }
      return await res.json();
    };
    
    console.log(fetcher(SEARCH_KEY, "steak")); // Promise 출력
    
    (async () => {
      console.log(await fetcher(SEARCH_KEY, "steak"));
    })(); // 원하는 객체값 출력
    
  • API_KEY:すべてのAPI共有鍵
  • KEY:APIを区別する鍵
  • keyword:APIリクエストのパラメータ