のJava-AngularJS HTTP GETメソッドは "" との文字列を取得し、文字

Question

私はHTTP GETリクエストするには、この機能を使用するエスケープ：

$scope.fetchResult = function() { 
    $http.get('search/result').success(function(getResult){ 
     $scope.result = getResult; 
    }); 
}; 

これは、バックエンド機能である：

@RequestMapping("/result") 
public @ResponseBody String getResult() { 
    return searchService.getResult(); 
} 

問題文字列が：

String result = "Hello"; 

のように、私は本当にこの後ろに論理を見つけることができません。

WebページにはHelloは印刷されませんが、代わりに「Hello」が印刷されます。別の例：

String result = "Found \"" + keyword + "\" '" + count + "' times at \"" + website + "\""; 

エスケープ文字も表示されます。

"Found \""keyword"\" '"0"' times at \""http://stackoverflow.com"\"" 

を私は期待して明らかにしながら：

Found "keyword" '0' times at "http://stackoverflow.com" 

私はこれをどのように修正することができますそれでは、キーワードは、キーワードであるカウントが0であるとウェブサイトはhttp://stackoverflow.com結果は、Webページ上でこのように印刷されているとしましょうか？これは本当に私には意味がありません。私はjsやWeb開発の初心者です。

編集：私はList<String>の代わりStringを使用して、HTMLフォームでこれを行う場合は、次の

<p ng-repeat:"res in result">{{res}}<p> 

それは動作します。しかし、リストを必要とせずに単一のStringを使用するので、実際にはこの方法で使用する必要はありません。

Answer 1

SpringにはSuffix Strategyと呼ばれるものがあります。これは、フレームワークがURLからパス拡張子をチェックして出力コンテンツタイプを決定できるようにします。

@RequestMappingが/result.json、.jsonの拡張子が設定されているため、結果がJsonオブジェクトとして返されるため、表示されるエンコードされた結果が発生します。

この問題を解決するには、複数のオプションがあります。

オプション1：

はあなたのJavaScriptでJSONオブジェクトとして返された応答を処理します。

オプション2：

だけ/resultする@RequestMapping値を変更します。以下のコードの例である：

import org.springframework.web.bind.annotation.CrossOrigin; 
import org.springframework.web.bind.annotation.RequestMapping; 
import org.springframework.web.bind.annotation.RequestMethod; 
import org.springframework.web.bind.annotation.ResponseBody; 
import org.springframework.web.bind.annotation.RestController; 

@RestController 
public class HelloWorldController { 
    @CrossOrigin(origins = "*") 
    @RequestMapping(value="/result") 
    public @ResponseBody String sayHello() { 
     String website = "http://stackoverflow.com"; 
     int count = 4; 
     String keyword = "keyword"; 
     return "Found \"" + keyword + "\" '" + count + "' times at \"" + website + "\""; 
    } 
} 

のJavascript

<script> 
var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope, $http) { 
    $http.get("/result",{headers: { 'Accept': 'text/plain' }}) 
    .then(function(response) { 
     $scope.result = response.data; 
    }); 
}); 
</script> 

オプション3

が使用サフィックス戦略/result.jsonとしてとして@RequestMapping値を保つが、無効（ヘッダを受け入れる追加すると、ここで任意です） WebMvcConfigurerAdapter。以下に、あなたはJavascriptまたはJavaを意味するか

import org.springframework.web.bind.annotation.CrossOrigin; 
import org.springframework.web.bind.annotation.RequestMapping; 
import org.springframework.web.bind.annotation.RequestMethod; 
import org.springframework.web.bind.annotation.ResponseBody; 
import org.springframework.web.bind.annotation.RestController; 

@RestController 
public class HelloWorldController { 
    @CrossOrigin(origins = "*") 
    @RequestMapping(value="/result.json", method = RequestMethod.GET, produces="text/plain") 
    public @ResponseBody String sayHello() { 
     String website = "http://stackoverflow.com"; 
     int count = 4; 
     String keyword = "keyword"; 
     return "Found \"" + keyword + "\" '" + count + "' times at \"" + website + "\""; 
    } 
} 

WebMvcConfigurerAdapterクラス

import org.springframework.context.annotation.Configuration; 
import org.springframework.http.MediaType; 
import org.springframework.web.servlet.config.annotation.ContentNegotiationConfigurer; 
import org.springframework.web.servlet.config.annotation.EnableWebMvc; 
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; 

@Configuration 
@EnableWebMvc 
public class WebConfig extends WebMvcConfigurerAdapter { 

    @Override 
    public void configureContentNegotiation(ContentNegotiationConfigurer configurer) { 
     configurer.favorPathExtension(false) 
     .favorParameter(false) 
     .ignoreAcceptHeader(false) 
     .useJaf(false) 
     .defaultContentType(MediaType.TEXT_PLAIN); 
    } 
} 

Javascriptを

<script> 
var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope, $http) { 
    $http.get("/result.json",{headers: { 'Accept': 'text/plain' }}) 
    .then(function(response) { 
     $scope.result = response.data; 
    }); 
}); 
</script>