从 Javascript 调用 Azure 函数答案

【问题标题】：Call Azure Function from Javascript从 Javascript 调用 Azure 函数
【发布时间】：2017-07-26 16:03:31
【问题描述】：

我有一个简单的 HTML 页面，它有一个文本框和一个提交按钮。我有一个 Azure 函数，当点击它时会接收文本框的内容，我们应该将其发送到 Azure 函数并发送邮件（代码是用 C# 中的 Azure 函数编写的）。

我做了什么：

我获取了文本框的值并通过 AJAX 调用了函数，但它根本没有命中。它发回 400 错误代码。

我想要的只是使用 Javascript 来实现该功能。因为我只有一个普通的 HTML 页面，而 JS 是我可以交流的唯一方式。

这是函数网址

它需要一个参数“名称”，我通过像这样在浏览器中粘贴来检查它

这是我在firefox中找到的

如果您需要更多信息，请告诉我

【问题讨论】：

【解决方案1】：

这绝对是一个与 CORS 相关的问题。幸运的是，在门户中为函数应用程序配置 CORS 很容易。只需导航到您的 Function App，然后选择 Platform Features：

选择 API 下的 CORS 选项，这将带您进入一个屏幕，您可以在其中添加客户端应用程序的主机名：

【讨论】：

感谢@jesse，这行得通。截至目前，我正在本地机器上进行测试，并且 HTML 页面没有托管在我在允许的来源列表中添加“*”的任何地方，并且它有效。谢谢队友
Sai 和 Jesse，我能确认一下吗？我们可以有一个仅客户端的 Javascript 解决方案，而不是使用像 ADAL 这样的身份验证库来调用经过 AAD 身份验证的 Azure 函数？我们似乎无法让它发挥作用。即使简单客户端也在 Azurewebsites 域下运行。
感谢您为我省去了很多挫折。这是微软最大的错误和弱点之一：他们什么时候才能学会将默认值（如这里的 CORS 默认值）设置为初学者获得预期结果的值？不要误会我的意思：Azure 很棒，但是像这样的默认设置并且在“入门”教程中没有提及它们，会造成极大的障碍。

【解决方案2】：

这看起来像是一个跨源请求被阻止。通常，您不能从浏览器向其他主机发出请求。您将需要使用 CORS 或后端代码。

请注意，请求的方法是 OPTIONS 而不是 Post 或 Get。通常这意味着浏览器正在阻止调用。

【讨论】：

谢谢 Brig，我已经浏览了这些示例，但在我的例子中，我只有一个文本框和一个按钮，所以我只想通过这个简单的设置调用 Azure 函数。我不想为此创建一个 ASPX 页面或 PHP 页面并在服务器上运行。如果它不可能，那么它的罚款。只是想知道