Cordova iOS 在本地文件上“Access-Control-Allow-Origin 不允许 Origin null”

问题描述 投票:0回答:4

我在 Cordova CLI 上开发一个项目,并在物理 iPhone 上编译应用程序,但在控制台中出现 Access Control Origin 错误。

这是消息:

[Error] Origin null is not allowed by Access-Control-Allow-Origin.
[Error] Failed to load resource: Origin null is not allowed by Access-Control-Allow-Origin. (bootstrap.min.css, line 0)

错误来自本地文件,也来自ajax。

我的config.xml的配置是:

<?xml version='1.0' encoding='utf-8'?>
<widget android-versionCode="14" defaultlocale="es-ES" id="com..." version="2.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>TEXT</name>
    <description>TEXT</description>
    <author email="MYEMAIL" href="MYURL">
        MYNAME
    </author>
    <content src="index.html" />
    <access origin="*" />        
    <allow-navigation href="*" />
    <preference name="windows-target-version" value="10.0" />
    <preference name="KeyboardDisplayRequiresUserAction" value="false" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />

在我项目的所有 html 文件中,元数据是:

<!DOCTYPE html>
<html lang="es">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src * data: content:; connect-src *;">
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">

我的项目数据是:

Cordova version 10.0.0
cordova-ios version  6.1.1

有人可以帮我解决这个问题吗? 我非常感谢你

cordova cordova-ios
4个回答
19
投票

使用 Cordova-ios@6,您需要按照文档

此处
 指定 
schemehostname

此外,此版本还引入了 WKURLSchemeHandler 支持。使用自定义方案通过修复由于 WKWebView 对文件方案应用了严格的安全策略而存在的 CORS 问题来提供应用程序内容。您可以通过在 config.xml 文件中设置首选项方案和主机名,轻松将 Cordova 项目配置为使用自定义方案。

<preference name="scheme" value="app" />
<preference name="hostname" value="localhost" />

这将从

app://localhost
而不是
file://
提供您的应用程序,并且您的 xhr 请求的
origin
也将是
app://localhost
。由于此源是与 CORS 请求一起发送的,因此您可能需要更改主机名以匹配远程域(如果您的应用程序使用远程域),不过只要将其添加到 CORS 中就可以了
Access-Control-Allow-Origin 
响应中的标题。


4
投票

因为没有WKWebView的出处,所以不能直接使用CORS。您需要一个插件来允许无来源的 XHR。

查看cordova-plugin-ios-xhr


0
投票

解决方案:

问题只是 bootstrap 样式表链接上的一个属性:P

    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous" />

问题是:

crossorigin="anonymous"

只需要这个:

<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet"/>

而服务器端,在用于ajax请求的PHP上添加:

header("Access-Control-Allow-Origin: *")

感谢您的宝贵时间


0
投票

使用 Cordova-ios@6,您需要根据 Cordova iOS 6.0.0 发布的文档指定方案和主机名! 这里

此外,还引入了 WKURLSchemeHandler 支持 发布。使用自定义方案通过修复来提供您的应用内容 由于严格的安全策略而存在 CORS 问题 WKWebView已应用于文件方案。您可以轻松配置 您的 Cordova 项目通过设置首选项来使用自定义方案 config.xml 文件中的选项方案和主机名。

这将从 app://localhost 而不是 file:// 提供您的应用程序,并且 xhr 请求的来源也将是 app://localhost。由于此源是与 CORS 请求一起发送的,因此您可能需要更改主机名以匹配远程域(如果您的应用程序使用远程域),但只要将其添加到 CORS 访问中,一切都应该没问题 -响应上的 Control-Allow-Origin 标头。

© www.soinside.com 2019 - 2024. All rights reserved.