2016-06-15 105 views
3

我一直在使用Cloud9製作一個Ionic應用程序。通過Cloud9從WordPress獲取JSON文件返回Cloud9 html文件

到目前爲止,該應用程序的前端做得很好。我通過Cloud9使用離子框架。

我的後端是另一個Cloud9項目。它使用WordPress來製作具有高級自定義字段的特定自定義帖子類型。然後它使用WP REST API以json格式生成數據。當我使用/ wp-json/posts?type = [specific type]在Cloud9上運行WordPress時,我可以訪問自定義帖子類型及其字段。

問題是,當我的離子應用程序使用$ http.get請求時,它根本不起作用。如果我在我的WordPress上下載的json文件上使用$ http.get,並將其添加到離子應用程序的工作區中,則一切正常。

因此,我在使用Cloud9通過離子應用程序(也在Cloud9工作區中)從託管的WordPress網站獲取json數據時出現問題。

兩個工作區都是分開的,並同時運行。

我的代碼加載JSON文件如下:

var defer = $q.defer(); 
 

 
$http.get('LINK TO .../wp-json/posts?type=[post type]', { cache: 'true'}) 
 
    .success(function(data) { 
 
      defer.resolve(data); 
 
    }); 
 

 
return defer.promise;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

正如mentionned,當我替換[JSON文件的名稱]上傳.json的聯繫,這是一個文件直接從REST API生成的json下載,所以與我試圖獲得的站點相同,它不起作用。

當我CONSOLE.LOG,而不是將數據記錄每個自定義後(與下載上傳.json會發生什麼)(數據),它記錄本:

<!DOCTYPE html> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
    <head profile="http://www.w3.org/2005/10/profile"> 
 
     <!--C9LOCAL_CODE_INJECT_PLACEHOLDER-(login-head)-DO_NOT_REMOVE--> 
 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
 
     <title>Sign-in | Cloud9 IDE - Ajax.org</title> 
 
     <meta name="description" content="Meet Cloud9, development-as-a-service for Javascripters and other developers"/> 
 
     <meta name="keywords" content=""/> 
 

 
     <link rel="icon" type="image/gif" href="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/homepage/favicon.ico" /> 
 

 
     <!--C9LOCAL_CODE_INJECT_PLACEHOLDER-(login-loadedDetectionScript)-DO_NOT_REMOVE--> 
 
     <link href="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/oldclient/homepage/style/signin.css" rel="stylesheet" type="text/css" /> 
 
     <script type="text/javascript" src="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/oldclient/homepage/js/prefixfree.min.js"></script> 
 
    </head> 
 
    <body class=""> 
 
     <script type="text/javascript"> 
 
      // ClickTale Top part 
 
      var WRInitTime=(new Date()).getTime(); 
 
      // ClickTale end of Top part 
 
     </script> 
 
     <div id="header"> 
 
      <a class="logo" href="/"></a> 
 
      <div class="social"> 
 
       <div class="socialMediaBlok"> 
 
        <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://c9.io/" data-text="Cloud9 IDE - Your code anywhere, anytime" data-count="horizontal" data-via="cloud9ide">Tweet</a> 
 
        <script type="text/javascript" src="//platform.twitter.com/widgets.js"></script> 
 
       </div> 
 
       <div class="socialMediaBlok"> 
 
        <iframe src="//www.facebook.com/plugins/like.php?href=c9.io&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=lucida+grande&amp;colorscheme=light&amp;height=21" 
 
         allowtransparency="true" 
 
         scrolling="no" 
 
         frameborder="0" 
 
         style="border:none; overflow:hidden;height:20px"></iframe> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <div class="headerdivider"></div> 
 
     <div id="signin_window"> 
 
      <div id="signinViewport"> 
 
       <div class="pageContainer"> 
 
        <div id="barForgetPass" class="page"> 
 
         <form id="resetPasswordForm"> 
 
          <div class="header">Reset password</div> 
 
          <div class="form-holder"> 
 
           <div id="lbl_inpResetPassword" class="c9-label"> 
 
            <label for="inpResetPassword">Username or email address</label> 
 
           </div> 
 
           <div class="c9-textbox"> 
 
            <div class="c9-txt_fix"> 
 
             <input type="text" id="inpResetPassword" name="inpResetPassword" disabled2="disabled" /> 
 
            </div> 
 
           </div> 
 
          </div> 
 
         </form> 
 

 
         <div class="fbox"> 
 
          <div id="btnRPCancel" class="cancel-button button">Go back</div> 
 
          <div id="btnRP" class="action-button button">Reset my password</div> 
 
         </div> 
 
         <div class="label3">Your password will be reset and you will receive an email with a new password.</div> 
 
        </div> 
 
        <div id="barSignIn" class="page"> 
 
         <form id="signinForm"> 
 
          <div class="header">Please sign in</div> 
 
          <div class="form-holder"> 
 
           <div id="lbl_inpUsernameEmail" class="c9-label"> 
 
            <label for="inpUsernameEmail">Username or email address</label> 
 
           </div> 
 
           <div id="txt_inpUsernameEmail" class="c9-textbox"> 
 
            <div class="c9-txt_fix"> 
 
             <input type="text" id="inpUsernameEmail" name="inpUsernameEmail" tabindex="1" /> 
 
            </div> 
 
           </div> 
 
           <div id="lbl_inpPassword" class="c9-label"> 
 
            <label for="inpPassword">Password</label> 
 
            <a id="forgetlink" class="forgetlink">Forgot?</a> 
 
           </div> 
 
           <div id="txt_inpPassword" class="c9-textbox"> 
 
            <div class="c9-txt_fix"> 
 
             <input type="password" id="inpPassword" name="inpPassword" tabindex="2" /> 
 
            </div> 
 
           </div> 
 

 
           <div class="fbox"> 
 
            <div id="cbRememberLogin" class="c9-checkbox" tabindex="3"> 
 
             <div class="check"></div><span>Remember my login</span> 
 
            </div> 
 
            <div id="btnSignIn" class="action-button button" tabindex="4" accesskey="ENTER">Sign in</div> 
 
           </div> 
 
          </div> 
 
          <div id="barSignInStatusMsg" class="signinstatus-bar"> 
 
           <div id="lblSignInHeader" class="errorboxContent"></div> 
 
           <div id="lblSignInStatus" class="errorboxContent"></div> 
 
          </div> 
 
         </form> 
 
<!--      <div id="btnLoginViaGitHub" class="c9-button btn-github" style="margin: 13px 0 0 12px;" tabindex="5"></div>--> 
 
         <div class="signin_options"> 
 
          <div class='info'>Or sign in with:</div> 
 
<!--       <a href="#" class="c9-button google-signin" tabindex="8"></a> 
 
          <a href="#" class="c9-button twitter-signin" tabindex="7"></a> 
 
          <a href="#" class="c9-button facebook-signin" tabindex="6"></a>--> 
 
          <a href="#" class="c9-button github-signin"></a> 
 
          <a href="#" class="c9-button bitbucket-signin"></a> 
 
         </div> 
 
        </div> 
 
        <div id="barActivationLink" class="page"> 
 
          <form id="activationlinkForm"> 
 
           <div class="header">Activation email</div> 
 
           <div class="form-holder"> 
 
            <div id="lbl_inpResetPassword" class="c9-label"> 
 
             <label for="inpResetPassword">Username or email address</label> 
 
            </div> 
 
            <div class="c9-textbox"> 
 
             <div class="c9-txt_fix"> 
 
              <input type="text" id="inpResendConfirmation" name="inpResendConfirmation" /> 
 
             </div> 
 
            </div> 
 
           </div> 
 
          </form> 
 
          
 
          <div class="fbox"> 
 
           <div id="btnALCancel" class="cancel-button button">Go back</div> 
 
           <div id="btnAL" class="action-button button">Resend activation email</div> 
 
          </div> 
 
          <!--div style="clear: both"></div--> 
 
         <!--div class="divider" style="margin:40px 5px 0 5px;"></div> 
 
         <div class="label3" style="margin:21px 17px 0 17px;">To receive the registration email again please click the button above.</div--> 
 
        </div> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <div id="signup_window"> 
 
      <div class="no_account_yet"></div> 
 
      <div class="signuplink-bar"> 
 
       <div class="bird"></div> 
 
       <div class="content"> 
 
        <a id="btnSignUpUrl" href="/signup">SIGN UP</a> FOR YOUR ACCOUNT 
 
       </div> 
 
      </div> 
 
     </div> 
 
<!--  <div id="terms_of_use"> 
 
      <a href="#">Terms of use</a> - &#169; 2011 - <a href="/">Register here</a> 
 
     </div>--> 
 
     <div class="sign_up_now"> 
 
      <a id="resendactivation">Resend my activation email</a> 
 
     </div> 
 
     
 

 
     <ul class="bottom_menu"> 
 
      <li><a href="/" class="selected">Home</a></li> 
 
      <li>|</li> 
 
      <li>Talk to us at <a href="http://twitter.com/cloud9ide/" target="_blank">Twitter</a> and <a href="http://www.facebook.com/Cloud9IDE/" target="_blank">Facebook</a></li> 
 
<!--   <li>|</li>--> 
 
<!--   <li><a href="#">Terms of use</a></li>--> 
 
      <li>|</li> 
 
      <li>Cloud9 IDE, Inc &#169; 2011</li> 
 
     </ul> 
 

 
     <script type="text/javascript" src="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/oldclient/homepage/js/jquery-1.5.1.min.js"></script> 
 
     <script type="text/javascript" src="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/oldclient/homepage/js/jquery.validate.min.js"></script> 
 
     <script type="text/javascript" src="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/oldclient/homepage/js/components.js"></script> 
 
     <script type="text/javascript" src="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/oldclient/homepage/js/code.js"></script> 
 
     <script type="text/javascript" src="https://cdn.c9.io/nc-3.1.2733-9ac8c40a/static/oldclient/homepage/js/signin.js"></script> 
 
     <!-- ClickTale Bottom part --> 
 
     <div id="ClickTaleDiv" style="display: none;"></div> 
 
     <script type='text/javascript'> 
 
      document.write(unescape("%3Cscript%20src=\"" + (document.location.protocol == "https:" 
 
       ? "https://clicktale.pantherssl.com/" 
 
       : "http://s.clicktale.net/") + "WRc5.js\"%20type=\"text/javascript\"%3E%3C/script%3E")); 
 
      </script> 
 
     <script type="text/javascript"> 
 
      var ClickTaleSSL = 1; 
 
      if (typeof ClickTale == "function") 
 
       ClickTale(48230, 1, "www"); 
 
     </script> 
 
     <!-- ClickTale end of Bottom part --> 
 
    </body> 
 
</html>

而且,因爲我使用chrome作爲我的應用程序的調試器,所以我使用Access-Control-Expose-Headers擴展。沒有這個擴展名,我得到另一個頭的錯誤。

回答

2

爲了允許服務對您的應用(或Wordpress)進行API調用,您需要打開右上方的共享菜單並公開您的應用。

在這種情況下,您可以在API中使用身份驗證鎖定應用程序,以便公開您的應用程序不應該成爲問題。

+1

非常感謝!有效 ! 我剛剛意識到它將我重定向到Cloud9登錄頁面。所以是的,我所要做的只是讓WordPress工作空間公開(至少在我託管它之前)。 –