加载表单数据并将其作为 json 传递给 api答案

【问题标题】：loading form data and passing it as a json to api加载表单数据并将其作为 json 传递给 api
【发布时间】：2021-12-22 10:06:13
【问题描述】：

我正在尝试使用 azure 个性化并进行食物预测。我附上了我正在使用的没有 API 密钥的代码。

我想使用表单并将contextFeatures 和actions 传递给API，而不是静态编写并使用azure-personalize API 对它们进行排名。

var myHeaders = new Headers();
myHeaders.append(
  "Ocp-Apim-Subscription-Key",
  "xxxxxxxxxxxxxxxxxxxxxxxxx"  
);
myHeaders.append("Content-Type", "application/json");

var raw = JSON.stringify({
  contextFeatures: [
    {
      timeOfDay: "Morning",
    },
  ],
  actions: [
    {
      id: "NewsArticle",
      features: [
        {
          type: "News",
        },
      ],
    },
    {
      id: "SportsArticle",
      features: [
        {
          type: "Sports",
        },
      ],
    },
    {
      id: "EntertainmentArticle",
      features: [
        {
          type: "Entertainment",
        },
      ],
    },
  ],
  excludedActions: ["SportsArticle"],
  eventId: "75269AD0-BFEE-4598-8196-C57383D38E10",
  deferActivation: false,
});

var requestOptions = {
  method: "POST",
  headers: myHeaders,
  body: raw,
  redirect: "follow",
};

fetch(
  "https://ibs-recommendations.cognitiveservices.azure.com/personalizer/v1.0/rank",
  requestOptions
)
  .then((response) => response.text())
  .then((result) => console.log(result))
  .catch((error) => console.log("error", error));

<html>
  <body>
    <script src="index.js"></script>
    <form>
      <label for="fname">Food:</label>
      <br />
      <input type="text" id="fname" name="fname" />
      <br />
      <label for="lname">Ingriends one:</label>
      <br />
      <input type="text" id="lname" name="lname" />
      <br />
      <label for="lnametwo">Ingriend two:</label>
      <br />
      <input type="text" id="lnametwo" name="lnametwo" />
      <br />
      <label for="quantity">Amount of food</label>
      <br />
      <input type="number" id="quantity" name="quantity" />
      <br />
      <label for="time">Pick the time:</label>
      <select id="time" name="time">
        <option value="breakfast">BreakFast</option>
        <option value="lunch">Lunch</option>
        <option value="dinner">Dinner</option>
      </select>
      <br />
      <input type="submit" />
    </form>
  </body>
</html>

【问题讨论】：

您的问题是什么？代码有问题吗？你调试了吗？
代码没有错。在 javascript 文件中，我在 JSON.stringify 中手动将原始数据作为 contextFeatures 和 actions 提供，但我希望它取自 @Andy 的形式

标签： javascript html json azure forms

【解决方案1】：

您可以检查 HTTP 触发器 webhook 和绑定以使用请求和响应对象

请参阅来自 Microsoft 的 doc。

因为我们可以将细节作为属性（body、headers、method）来获取。

通过以下方式我们可以访问请求和响应。

// You can access your HTTP request off the context ...
if(context.req.body.emoji === ':pizza:') context.log('Yay!');
// and also set your HTTP response
context.res = { status: 202, body: 'You successfully ordered more coffee!' };

【讨论】：