codeigniter 404(页面未找到)

tkclm6bt  于 2022-12-16  发布在  其他
关注(0)|答案(2)|浏览(110)

我正在集成Google Drive API,用于将文件从HTML表单上传到Google云端硬盘。当我在CorePHP中实现代码( AJAX 和jQuery)时,它工作正常,但在CodeIgniter 4中不工作。问题是由于URL吗?
Web浏览器的控制台显示错误:
404upload.html?code=4/0AX4XfWgb3ql4RL2FfY7RdaL7jgyDOYT3CztsruXIbiLNdziDJKZ_UWFNK3qNzEgdcZrMFQ&scope=https://www.googleapis.com/auth/drive(页面未找到)
文件 index.html(用于登录Google帐户):

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Git Login App</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="main.js"></script>
</head>
<body>
   <div>
       <button id="login">
           Upload Files to Drive
       </button>
   </div>
</body>
</html>

文件 main.js(重定向到 upload.html 以将文件上传到Google云端硬盘):

$(document).ready(function() {

    // Client id of the project
    var clientId = "";

    // redirect_uri of the project
    var redirect_uri = "http://localhost:8080/upload.html";

    // Scope of the project
    var scope = "https://www.googleapis.com/auth/drive";

    // The URL to which the user is redirected to
    var url = "";

    // This is event click listener for the button
    $("#login").click(function() {

        // This is the method which will be invoked it takes four parameters

        signIn(clientId, redirect_uri, scope, url);
    });

    function signIn(clientId, redirect_uri, scope, url) {

        // The actual URL to which the user is redirected to
        url = "https://accounts.google.com/o/oauth2/v2/auth?redirect_uri=" + redirect_uri +
        "&prompt=consent&response_type=code&client_id=" + clientId + "&scope=" + scope +
        "&access_type=offline";T

        // This line makes the user redirected to the URL
        window.location = url;
    }
});

文件 * 上传.html*:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Git Login App</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" media="screen" href="upload.css"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="upload.js"></script>
</head>
<body>
   <div>
     <input id="files" type="file" name="files[]" multiple/>
     <button id="upload">Upload</button>
     <div id="progress-wrp">
        <div class="progress-bar"></div>
        <div class="status">0%</div>
    </div>
   </div>
   <div id="result">

   </div>
</body>
</html>

文件 * 上传.js*:

$(document).ready(function() {

    const urlParams = new URLSearchParams(window.location.search);
    const code = urlParams.get('code');
    const redirect_uri = "http://localhost:8080/upload.html" // Replace with your redirect_uri;
    const client_secret = ""; // Replace with your client secret
    const scope = "https://www.googleapis.com/auth/drive";
    var access_token = "";
    var client_id = "" // Replace it with your client id;

    $.ajax({
        type: 'POST',
        url: "https://www.googleapis.com/oauth2/v4/token",
        data: {code: code,
               redirect_uri: redirect_uri,
               client_secret: client_secret,
               client_id: client_id,
               scope: scope,
               grant_type: "authorization_code"},
               dataType: "json",
               success: function(resultData) {
                   localStorage.setItem("accessToken", resultData.access_token);
                   localStorage.setItem("refreshToken", resultData.refreshToken);
                   localStorage.setItem("expires_in", resultData.expires_in);
                   window.history.pushState({}, document.title, "/GitLoginApp/" + "upload.html");
               }
    });

    function stripQueryStringAndHashFromPath(url) {
        return url.split("?")[0].split("#")[0];
    }

    var Upload = function (file) {
        this.file = file;
    };

    Upload.prototype.getType = function() {
        localStorage.setItem("type", this.file.type);
        return this.file.type;
    };

    Upload.prototype.getSize = function() {
        localStorage.setItem("size", this.file.size);
        return this.file.size;
    };

    Upload.prototype.getName = function() {
        return this.file.name;
    };

    Upload.prototype.doUpload = function () {
        var that = this;
        var formData = new FormData();

        // Add assoc key values. This will be posts values
        formData.append("file", this.file, this.getName());
        formData.append("upload_file", true);

        $.ajax({
            type: "POST",
            beforeSend: function(request) {
                request.setRequestHeader("Authorization", "Bearer" + " " + localStorage.getItem("accessToken"));
            },
            url: "https://www.googleapis.com/upload/drive/v2/files",
            data:{
                uploadType: "media"
            },
            xhr: function () {
                var myXhr = $.ajaxSettings.xhr();
                if (myXhr.upload) {
                    myXhr.upload.addEventListener('progress', that.progressHandling, false);
                }
                return myXhr;
            },
            success: function (data) {
                console.log(data);
            },
            error: function (error) {
                console.log(error);
            },
            async: true,
            data: formData,
            cache: false,
            contentType: false,
            processData: false,
            timeout: 60000
        });
    };

    Upload.prototype.progressHandling = function (event) {
        var percent = 0;
        var position = event.loaded || event.position;
        var total = event.total;
        var progress_bar_id = "#progress-wrp";
        if (event.lengthComputable) {
            percent = Math.ceil(position / total * 100);
        }
        // Update progressbars classes so it fits your code
        $(progress_bar_id + " .progress-bar").css("width", +percent + "%");
        $(progress_bar_id + " .status").text(percent + "%");
    };

    $("#upload").on("click", function (e) {
        var file = $("#files")[0].files[0];
        var upload = new Upload(file);

        // Maybe check size or type here with upload.getSize() and upload.getType()

        // Execute upload
        upload.doUpload();
    });

});

我是新来的代码点火器4。

1mrurvl1

1mrurvl11#

如果你认为php版本和.htaccess设置是正确的..尝试在Config/route.php文件中设置自动路由按照https://caramengetahui.com/artikel/read/cara-mengatasi-file-not-found-cant-find-a-route-for-get下面链接中的说明操作

slwdgvem

slwdgvem2#

如果服务器无法找到请求的资源,通常会收到 404 Not Found 响应。
HTTP 404
HTTP 404,404 not found,404,404 error,page not found or file not found错误消息是计算机网络通信中的一个超文本传输协议(HTTP)标准响应代码,用于指示浏览器能够与给定服务器通信,但服务器无法找到所请求的内容。
在您的特定情况下,redirect_uri指向的GET /upload.html在您的路由文件(app\Config\Routes.php)中没有明确定义。

溶液

在路线文件中定义路线。即:
$routes->get("upload.html", "Home::upload");
其中第一个参数表示 URI,第二个参数表示响应的***Controller***::方法
您可以使用以下命令获取 * 控制器方法 * 中的查询参数:

// Sample route: http://localhost:8080/upload.html?code=4/0AX4XfWgb3ql4RL2FfY7RdaL7jgyDOYT3CztsruXIbiLNdziDJKZ_UWFNK3qNzEgdcZrMFQ&scope=https://www.googleapis.com/auth/drive

$params = $this->request->getGet();

/*
* Output.

[
  "code" => "4/0AX4XfWgb3ql4RL2FfY7RdaL7jgyDOYT3CztsruXIbiLNdziDJKZ_UWFNK3qNzEgdcZrMFQ",
 "scope" => "https://www.googleapis.com/auth/drive"
]
*/

相关问题